<template>
	<view class="">
		<u-form label-position="left" :model="ufrom" ref="from" :rules="rules" :error-type="erroryType">
			<u-form-item :border-bottom="false" prop="money">
				<view class="top">
					<view class="linH top-t">提现金额：</view>
					<view class="linH input-con row">
						<input type="digit" v-model="ufrom.money" placeholder="请输入提现金额" class="input" confirm-type="next" />
					</view>
					<view class="b-t linH">
						<text class="top-b">本次提现收取手续费：{{proportion}}%，</text>
						<text class="top-b" v-if="relMoney!=0">实际到账：￥{{relMoney}}</text>
					</view>
					<view class="b-t linH">
						<text class="top-b">正常工作日周一至周五每天下午2:30至5:00正常办理提现</text>
					</view>
				</view>
			</u-form-item>
			<view class="top" style="margin-top:16upx;padding: 0 20upx;">
				<u-form-item label="银行卡账户" prop="account" label-width="180">
					<input
						type="idcard"
						value=""
						class="finput"
						v-model="ufrom.account"
						placeholder="请输入提现的银行卡账号"
						confirm-type="next"
					/>
				</u-form-item>
				<u-form-item label="持卡人姓名" prop="name" label-width="180">
					<input type="text" value="" class="finput" v-model="ufrom.name" placeholder="请输入姓名" confirm-type="done" />
				</u-form-item>
			</view>
		</u-form>

		<view class="btn" hover-class="hover-opacity" @tap="subFrom">提交申请</view>
	</view>
</template>

<script>
import {checkStr} from "@/common/js/util.js";
export default {
	data() {
		return {
			type: "",
			maxMoney:0,
			erroryType: ["toast"],
			proportion: "",
			ufrom: {
				money: "",
				account: "",
				name: ""
			},
			rules: {
				money: [{required: true, message: "请输入提现金额"}],
				account: [
					{required: true, message: "请输入银行卡号"},
					{
						validator: (rule, value, callback) => {
							return checkStr(value.replace(/\s+/g,""), "brank");
						},
						message: "银行卡号错误"
					}
				],
				name: [{required: true, message: "请输入持卡人姓名"}]
			}
		};
	},
	computed:{
		relMoney(){
			let money=this.ufrom.money==""?0:Number(this.ufrom.money);
			 return ((this.ufrom.money*100-money*this.proportion)/100).toFixed(2);
		}
	},
	onLoad(options) {
		this.type = options.type;
		this.maxMoney=options.money;
		this.ufrom.money=options.money;
		this.getProportion();
	},
	onReady() {
		this.$refs.from.setRules(this.rules);
	},
	methods: {
		async getProportion() {
			const res = await this.$request("user/withdraw-recharge", {});
			if (res.result == 0) {
				this.proportion = res.data.proportion;
			} else {
				this.$util.msg(res.resultNote);
			}
		},
		// 0余额1佣金
		subFrom() {
			console.log(this.ufrom.money);
			this.$refs.from.validate(async valid => {
				console.log(valid);
				if (valid) {
					if(this.ufrom.money>this.maxMoney){
						this.$util.msg("余额不足!");
						return
					}
					const data = {
						uid:uni.getStorageSync('uid'),
						account:this.ufrom.account,
						money:this.ufrom.money,
						name:this.ufrom.name,
						type:this.type
					};
					const res = await this.$request("user/withdraw", data, {showLoading: true});
					if (res.result == 0) {
						this.$util.msg("提交成功!请耐心等待平台审核!");
						this.back();
					} else {
						this.$util.msg(res.resultNote);
					}
				}
			});
		}
	}
};
</script>
<style>
page {
	background: #f6f6f6;
}
</style>
<style scoped>
.linH {
	line-height: 100upx;
	padding: 0 20upx;
}
.top {
	background: #ffffff;
}
.top-b {
	font-size: 22upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #896c4d;
}
.top-t {
	font-size: 22upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #333333;
}
.input {
	width: 100%;
	line-height: 100upx;
	height: 100upx;
}
.input-con::before {
	content: "￥";
	font-size: 48upx;
	font-family: SourceHanSansCN;
	font-weight: 400;
	color: #333333;
}
.finput {
	text-align: right;
}
.btn {
	width: 700upx;
	height: 88upx;
	line-height: 88upx;
	background: #bec3cf;
	border-radius: 44upx;
	font-size: 28upx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #ffffff;
	position: fixed;
	bottom: 50upx;
	left: 25upx;
	text-align: center;
}
</style>
